/* 偏好设置 */
import React, { useEffect, useState } from 'react'
import { useSelector } from 'react-redux';
function Setup() {
 const handleDragStart = (event: React.DragEvent<HTMLDivElement>) => {
    // 设置拖拽的数据
    event.dataTransfer.setData('text/plain', 'Hello');
  };

  const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {
    // 阻止默认行为以允许放置
    event.preventDefault();
  };

  const handleDrop = (event: React.DragEvent<HTMLDivElement>) => {
    // 阻止默认行为
    event.preventDefault();
    
    // 获取拖拽的数据
    const data = event.dataTransfer.getData('text/plain');
    console.log('Dropped:', data);
  };

  const [count, setCount] = useState(0)
  useSelector((store:any)=>console.log(store.reducer.data))
  useEffect(() => {
    console.log('11111');

  })
  return (
    <div>
      偏好设置
      <p>数量 :{count} </p>
      <button onClick={() => setCount(count + 1)}>++++++++ </button>

       <div
        draggable
        onDragStart={handleDragStart}
        onDragOver={handleDragOver}
        onDrop={handleDrop}
        style={{
          width: '200px',
          height: '200px',
          border: '1px solid #ccc',
          textAlign: 'center',
          lineHeight: '200px',
        }}
      >
        拖拽我
      </div>
    </div>
  )
}

export default Setup
